// 通过回调函数来返回最终的值
function addInputRadiotBox(callBackFun, lableName, radioData = [{ 'key(键)': 'value(值)' }], required = false) {
    //创建
    return createInputRadiotBox(callBackFun, lableName, radioData, required);
}

//当最后获取值的时候，直接点提交，需要检查，必填的需要进行提示
function checkInputRadiotBox(inputRadioBoxEl) {
    // 因为可能会有多个inputRadioBox，所以要单独处理
    if (inputRadioBoxEl.firstElementChild.classList.contains('required-flag')) {
        let isSelect = false;
        [...inputRadioBoxEl.lastElementChild.firstElementChild.children].map(v => {
            if (v.classList.contains('check')) {
                isSelect = true;
            }
        });
        if (!isSelect) {
            // 必填没选择，进行提示
            inputRadioBoxEl.lastElementChild.firstElementChild.classList.add('prompt');
            inputRadioBoxEl.lastElementChild.firstElementChild.classList.add('luminescence');
            inputRadioBoxEl.lastElementChild.lastElementChild.style.visibility = 'visible';
            // 检验不通过
            return false;
        }
        // 检验通过
        return true;
    }
    return true;
}

function createInputRadiotBox(callBackFun, lableName, radioData, required) {
    const inputRadioBoxEl = document.createElement('div');
    inputRadioBoxEl.className = 'input-radio-box';
    const lableEl = document.createElement('div');
    lableEl.className = 'label-style';
    lableEl.innerText = lableName;
    if (required) {
        lableEl.classList.add('required-flag');
    }
    const contentEl = document.createElement('div');
    contentEl.className = 'content-style';
    const mianBoxEl = document.createElement('div');
    mianBoxEl.className = 'input-radio-main-box';
    radioData.forEach(v => {
        let key = Object.keys(v)[0];
        let value = Object.values(v)[0];
        const radioBoxEl = document.createElement('div');
        radioBoxEl.className = 'input-radio-main-radio-box';
        const radioDotBoxEl = document.createElement('div');
        radioDotBoxEl.className = 'input-radio-main-radio-dot-box';
        const radioTextEl = document.createElement('span');
        radioTextEl.className = 'input-radio-main-radio-text-box';
        radioTextEl.innerText = value;
        radioBoxEl.appendChild(radioDotBoxEl);
        radioBoxEl.appendChild(radioTextEl);
        radioBoxEl.addEventListener('click', () => {
            //去除提示消息
            if (mianBoxEl.classList.contains('prompt')) {
                mianBoxEl.classList.remove('prompt')
            }
            if (mianBoxEl.classList.contains('luminescence')) {
                mianBoxEl.classList.remove('luminescence')
            }
            if (footerEl.style.visibility == 'visible') {
                footerEl.style.visibility = 'hidden';
            }
            //去除其他全部样式，点击事件在异步，可以获取全部子元素
            [...mianBoxEl.children].map(v => {
                v.classList.remove('check');
            });
            //加上样式
            radioBoxEl.classList.add('check');
            //把值传回去
            callBackFun(key);
        });
        mianBoxEl.appendChild(radioBoxEl);
    });
    const footerEl = document.createElement('div');
    footerEl.className = 'input-radio-footer-box';
    footerEl.innerText = '请选择内容！';
    contentEl.appendChild(mianBoxEl);
    contentEl.appendChild(footerEl);
    inputRadioBoxEl.appendChild(lableEl);
    inputRadioBoxEl.appendChild(contentEl);
    return inputRadioBoxEl;
}